<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Amber - Pet Care Bootstrap 5 Template</title>

    <!-- Favicons -->
    <link rel="shortcut icon" th:href="@{/assets/images/favicon.ico}">
    <link rel="stylesheet" th:href="@{https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css}" integrity="sha384-HSMxcRTRxnN+Bdg0JdbxYKrThecOKuH5zCYotlSAcp1+c8xmyTe9GYg1l9a69psu" crossorigin="anonymous">





    <link rel="stylesheet" th:href="@{/assets/css/vendor/vendor.min.css}">
    <link rel="stylesheet" th:href="@{/assets/css/plugins/plugins.min.css}">
    <link rel="stylesheet" th:href="@{/assets/css/style.min.css}">




</head>

<body>
    <!-- Header Section Start -->
    <!-- 头部导航栏，引入公共片页面 -->
    <div class="header section" th:replace="~{common/head::head}"></div>

        <!-- Header Top End -->

        <!-- Header Bottom Start -->

    <!-- Header Section End -->

    <!-- Breadcrumb Area Start -->
    <div class="section breadcrumb-area bg-name-bright">
        <div class="container">
            <div class="row">
                <div class="col-12 text-center">
                    <div class="breadcrumb-wrapper">
                        <h2 class="breadcrumb-title">动态详情</h2>
                        <ul>
                            <li><a href="index.html">Home</a></li>
                            <li>Blog Details</li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Breadcrumb Area End -->

    <!-- Blog Details Section Start -->
    <input type="hidden" th:value="${isReport}" id="isReport">
<div>
   <!-- <form action="/dynamic/queryDynamic">
        <input type="text" th:value="${dynamic01.dynamicTitle}">
        <input type="">
        <p></p>

    </form>-->
</div>
    <div class="section section-margin" >
        <div class="container">
            <div class="row">
                <div class="col-lg-9 m-auto overflow-hidden">
                    <!-- Blog Details Wrapper Start -->
                    <div class="blog-details-wrapper">

                        <!-- Blog Details Content Start -->
                        <div class="blog-details-content">

                            <!-- Blog Image Start -->
                            <div class="blog-image">


                                <img th:src="'http://localhost:8080/uploadFile/dynamic/'+${dynamic01.dynamicCover}" alt="Blog Image" class="fit-image">
                            </div>
                            <!-- Blog Image End -->

                            <!-- Blog details title & Meta Start -->
                            <div class="blog-details-title-meta">
                                <h2 class="title">[[${dynamic01.dynamicTitle}]]</h2>
                                <ul class="blog-meta">
                                    <li>By: <a href="#/">[[${dynamic01.UserId}]]</a> <span>[[${dynamic01.createTime}]]</span></li>
                                    <li>03 Comments</li>
                                </ul>
                            </div>
                            <!-- Blog details title & Meta End -->

                            <!-- Content Start -->
                            <p>[[${dynamic01.contentText}]]</p>
                            <!-- Blogquote Start -->
                            <blockquote></blockquote>

                            <!--<div class="blog-details-tag-social m-b-n20">

                                &lt;!&ndash; Blog Details Tags Start &ndash;&gt;
                                <div class="blog-details-tag m-b-20">
                                    <ul>
                                        <li><a href="#/">Cat</a></li>
                                        <li><a href="#/">Dog</a></li>
                                        <li><a href="#/">Fish</a></li>
                                    </ul>
                                </div>
                                &lt;!&ndash; Blog Details Tags End &ndash;&gt;

                                &lt;!&ndash; Social Shear Start &ndash;&gt;
                                <div class="social-share m-b-20">
                                    <div class="widget-social">
                                        <span>Share: </span>
                                        <a title="Twitter" href="#/"><i class="icon-social-twitter"></i></a>
                                        <a title="Instagram" href="#/"><i class="icon-social-instagram"></i></a>
                                        <a title="Linkedin" href="#/"><i class="icon-social-linkedin"></i></a>
                                        <a title="Skype" href="#/"><i class="icon-social-skype"></i></a>
                                        <a title="Dribble" href="#/"><i class="icon-social-dribbble"></i></a>
                                    </div>
                                </div>
                                &lt;!&ndash; Social Shear End &ndash;&gt;

                            </div>-->
                            <!-- Blog Details Tags & Social Shear End -->
                        </div>
                        <div class="social-share m-b-20">
                            <div class="widget-social">
                                <input type="hidden" th:value="${dynamic01.dynamicId}" id="getDynamicId">
                                <a href="javascript:void(0)" onclick="report()">
                                    <span id="reportH">举报</span>
                                </a>
                            </div>
                        </div>
                        <!-- Blog Details Content End -->


                        <!-- Blog Details Comments area Start -->
                        <div class="blog-details-comment-area m-b-n30">
                            <h2 class="blog-desc-title m-b-30 m-t-40">评论详情</h2>
                           <!-- <div class="blog-details-comment-wrapper m-b-30">
                                <div class="thumb">
                                    <img class="fit-image" th:src="@{/assets/images/blog/small-size/95x95.jpg}" alt="Blog Review">
                                </div>
                                <div class="content">
                                    <h4 class="title">Catherin Betty</h4>
                                    <ul class="meta">
                                        <li>27 Oct 2021</li>
                                    </ul>
                                    <p></p>
                                </div>
                            </div>-->

                            <div class="blog-details-comment-wrapper m-b-30" th:each="c:${commentVos}">
                                <div class="thumb">
                                    <img class="fit-image" th:src="@{/assets/images/blog/small-size/95x95-2.jpg}" alt="Blog Review">
                                </div>
                                <div class="content">
                                    <h4 class="title">[[${c.userName}]]</h4>
                                    <ul class="meta">
                                        <!--<li>[[${createTime}]]</li>-->
                                        <td th:text="${#dates.format(c.createTime,'yyyy-MM-dd')}"></td>
                                    </ul>

                                    <p>[[${c.commentContent}]]</p>
                                </div>
                            </div>
                        </div>
                        <!-- Blog Details Comments area End -->

                        <!-- Comments Post Area Start -->
                        <div class="comment-post-area">
                            <h2 class="blog-desc-title m-b-30 p-t-40">填写评论</h2>
                            <form th:action="@{/addComment}">
                                <div class="row">
                                    <!-- Name Input Start -->

                                    <!-- Email Input End -->

                                    <!-- Message Input Start -->
                                    <div class="col-12 col-custom">
                                        <div class="input-item m-b-20">
                                            <input type="hidden" name="dynamicId" th:value="${dynamicId}">
                                            <textarea cols="30" rows="10" name="commentContent" class="rounded-0 w-100 custom-textarea input-area" placeholder="请输入" spellcheck="false" data-gramm="false"></textarea>
                                        </div>
                                    </div>
                                    <!-- Message Input End -->

                                    <!-- Submit Button Start -->
                                    <div class="col-12 col-custom m-t-20">
                                        <button type="submit" class="btn btn-primary btn-hover-dark">提交</button>
                                    </div>
                                    <!-- Submit Button End -->

                                </div>
                            </form>
                        </div>
                        <!-- Comments Post Area End -->

                    </div>
                    <!-- Blog Details Wrapper End -->
                </div>
            </div>
        </div>
    </div>
    <!-- Blog Details Section End -->
    <footer class="section footer-section" th:replace="~{common/foot::foot}"></footer>

    <script th:src="@{/assets/js/vendor.min.js}"></script>
    <script th:src="@{/assets/js/plugins.min.js}"></script>

    <!--Main JS-->
    <script th:src="@{/assets/js/main.js}"></script>
</body>

<script th:inline="javascript">
    let isReportStr = $('#isReport').val();
    let getDynamicIdStr = $('#getDynamicId').val();
    let isReprot = parseInt(isReportStr);
    let getDynamicId = parseInt(getDynamicIdStr);
    let user=[[${session.user}]]
    let userId=user.userId
    var span = document.getElementById("reportH");

    if (isReprot == 3) {
        span.innerHTML = "举报";
    }else if(isReprot==0){
        span.innerHTML = "正在处理";
    }else if(isReprot==1){
        span.innerHTML = "经查实，已整改";
    }

    // 点击举报
    function report() {
        if (isNaN(userId) || userId==null) {
            alert("请先登录")
            location="http://localhost:9001/login.html"
        } else if (isReprot == 0) { //已经举报未处理
            alert("正在处理您的举报")
        }else if(isReprot == 1){
            alert("经查实，已整改")
        }else {
            location="Http://localhost:9001/dynamic/report?dynamicId="+getDynamicId
        }
    }



</script>

</html>